import { useState, useRef } from 'react';

function Son(props) {
  console.log(11, props);

  const send = props.send
  return (
    <div>
      <div>son:{props.name}-{props.age}</div>

      <button onClick={() => send('子的数据233')}>子传父的信息</button>

    </div>
  )
}


export default function App() {
  const divRef = useRef(null)
  const showRef = () => {
    console.log(divRef.current)
    console.dir(divRef.current)

  }

  const [msg, setMsg] = useState('默认父信息')
  const fsend = (e) => {
    console.log(222, e);
    setMsg(e)
  }
  return (
    <div>
      <h1>11 useRef获取真实dom</h1>
      <hr />

      <div style={{ fontSize: '44px' }} ref={divRef}>样式侠士</div>
      <button onClick={showRef}>获取dom</button>

      <h1>12 父子相互传</h1>
      <hr />
      {msg}
      <Son name='小米' age={18}
        isTrue={false}
        list={['vue', 'react']}
        obj={{ name: 'jack' }}
        cb={() => console.log(123)}

        send={fsend}
      />

    </div >
  )
}